<template>
  <div>
    <block v-for="(item, index) in menuData" :key="index" v-show="item.type == menuCate">
        <el-submenu :index="index" v-if="item.children">
            <template slot="title">
            <i :class="item.icon"></i>
            <span slot="title">{{ item.text }}</span>
            </template>
            <menu-tree :menuData="item.children"></menu-tree>
        </el-submenu>

        <el-menu-item
            :index="index"
            @click="addTabs(item)"
            v-show="item.children.length == 0"
        v-else>
            <i :class="item.icon"></i>
            <span slot="title">{{ item.text }}</span>
        </el-menu-item>
    </block>
  </div>
</template>
 
<script>
import ElSubmenu from "element-ui/packages/submenu";
import ElMenuItem from "element-ui/packages/menu-item";
import ElMenuItemGroup from "element-ui/packages/menu-item-group";
export default {
  components: {
    ElSubmenu,
    ElMenuItem,
    ElMenuItemGroup,
  },
  props: ["menuData", "menuCate"],
  name: "MenuTree",
};
</script>